<template>
  <a-modal :visible="visible"
           okText="保存"
           cancelText="取消"
           @cancel="emit('close')"
           @ok="submit"
           title="添加新分类">
    <a-form>
      <a-form-item label="名称">
        <a-input v-model:value="form.name"></a-input>
      </a-form-item>
      <a-form-item label="简介">
        <a-textarea col="5" v-model:value="form.description"></a-textarea>
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script setup>
import {ref} from "vue";
import {apiPost} from "../../../../fentch";
import {message} from "ant-design-vue";

const props = defineProps({
  visible: {
    type: Boolean,
    required: true,
    default: false
  }
})

const form = ref({
  name: '',
  description: ''
})

const emit = defineEmits(['close', 'reload'])

const submit = () => {
  apiPost('/classify', form.value).then(res => {
    if (res.data.code === 0) {
      form.value.name = ''
      form.value.description = ''
      emit('close')
      emit('reload')
      return
    }
    message.error(res.data.message)
  })
}
</script>

<style scoped>

</style>